<template>
  <div class="index">
    <div class="header"></div>
    <div class="title clearfix">
      <div class="logo fl">
        <img src="@/assets/image/star.jpg" alt="" />
      </div>
      <div class="logo_title fl">
        <div class="logo_title_t">全国一体化在线政务服务平台</div>
        <div class="logo_title_c">国家政务服务平台</div>
        <div class="logo_title_b">
          www.<span style="color: #9c0914;">gjzwfw</span>.gov.cn
        </div>
      </div>
      <ul class="nav-ul">
        <li class="list">
          <a @click="goHome">首页</a>
        </li>
        <li class="list">
          <a href="http://gjzwfw.www.gov.cn/col/col485/index.html"
            >国务院部门服务窗口</a
          >
        </li>
        <li class="list">
          <a href="http://gjzwfw.www.gov.cn/col/col486/index.html"
            >地方政府服务窗口</a
          >
        </li>
        <li class="list">
          <a
            href="http://gjzwfw.www.gov.cn/fwmh/item/indexGrOrFrItemList/007.do?isGrOrFr=1&amp;type=2"
            >个人办事</a
          >
        </li>
        <li class="list">
          <a
            href="http://gjzwfw.www.gov.cn/fwmh/item/indexGrOrFrItemList/004.do?isGrOrFr=2&amp;type=2"
            >法人办事</a
          >
        </li>
        <li class="list">
          <a href="http://gjzwfw.www.gov.cn/fwmh/bmfw/index.do">公共服务</a>
        </li>
      </ul>
    </div>
    <div class="banana">
      <img src="@/assets/image/bg.png" alt="" />
    </div>
    <div class="newBox">
      <div class="countryNum">
        <div class="countryHeader clearfix">
          <div class="countryHeader_l fl">
            全国各阶段项目数
          </div>
          <div class="countryHeader_r fr clearfix">
            <span>
              <el-date-picker
                v-model="startTime"
                type="date"
                value-format="yyyy-MM-dd"
                placeholder="选择日期"
              >
              </el-date-picker
            ></span>
            <span style="margin:0 5px;color:#666666;">-</span>
            <span>
              <el-date-picker
                v-model="endTime"
                type="date"
                value-format="yyyy-MM-dd"
                placeholder="选择日期"
              >
              </el-date-picker>
            </span>
            <span>
              <div class="countryBtn" @click="goCountrySearch">查询</div>
            </span>
          </div>
        </div>
        <div class="countryBox">
          <div class="countryList">
            <img
              style="margin-top: 6px"
              src="@/assets/image/plan_use_land.png"
            />
            <h2>{{ projectNumObj.SPJDXH1 ? projectNumObj.SPJDXH1 : 0 }}</h2>
            <h4>立项用地规划许可</h4>
          </div>
          <div class="countryList">
            <img
              style="margin-top: 6px"
              src="@/assets/image/project_permit.png"
            />
            <h2>{{ projectNumObj.SPJDXH2 ? projectNumObj.SPJDXH2 : 0 }}</h2>
            <h4>工程建设许可</h4>
          </div>
          <div class="countryList">
            <img
              style="margin-top: 6px"
              src="@/assets/image/construction_permit.png"
            />
            <h2>{{ projectNumObj.SPJDXH3 }}</h2>
            <h4>施工许可</h4>
          </div>
          <div class="countryList">
            <img
              style="margin-top: 6px"
              src="@/assets/image/completion_acceptance.png"
            />
            <h2>{{ projectNumObj.SPJDXH4 ? projectNumObj.SPJDXH4 : 0 }}</h2>
            <h4>竣工验收</h4>
          </div>
          <div class="countryList">
            <img
              style="margin-top: 6px"
              src="@/assets/image/parallel_push.png"
            />
            <h2>{{ projectNumObj.SPJDXH5 ? projectNumObj.SPJDXH5 : 0 }}</h2>
            <h4>并行推进</h4>
          </div>
        </div>
      </div>
      <div class="provinceRank clearfix">
        <div class="averageTimeBox fl">
          <div class="averageTimeHeader clearfix">
            <div class="averageTimeHeader_l fl">
              各省审批平均总用时排名
            </div>
            <div class="averageTimeHeader_r fr" @click="goProviceMore(1)">
              更多>
            </div>
          </div>
          <div class="averageTimeTable">
            <el-table
              :data="averageTimeData"
              style="width: 100%"
              border
              :header-cell-style="{
                'background-color': '#FFEEEF',
                'border-top': '1px solid #E9EAF2',
                color: '#333333',
              }"
            >
              <el-table-column
                type="index"
                width="80"
                label="排名"
                align="center"
              >
              </el-table-column>
              <el-table-column
                prop="CITY_NAME"
                label="城市"
                align="center"
                width="120"
              >
              </el-table-column>
              <el-table-column
                prop="TOTAL_CNT"
                label="审批平均总用时（天）"
                align="center"
              >
              </el-table-column>
            </el-table>
          </div>
        </div>
        <div class="overdueBox fr">
          <div class="overdueHeader clearfix">
            <div class="overdueHeader_l fl">
              各省逾期项目数排名
            </div>
            <div class="overdueHeader_r fr" @click="goProviceMore(2)">
              更多>
            </div>
          </div>
          <div class="overdueTable">
            <el-table
              :data="overdueData"
              style="width: 100%"
              border
              :header-cell-style="{
                'background-color': '#FFEEEF',
                'border-top': '1px solid #E9EAF2',
                color: '#333333',
              }"
            >
              <el-table-column
                type="index"
                width="80"
                label="排名"
                align="center"
              ></el-table-column>
              <el-table-column
                prop="cityName"
                label="城市"
                align="center"
                width="120"
              >
              </el-table-column>
              <el-table-column
                prop="itemTotal"
                label="项目总数（个）"
                align="center"
              >
              </el-table-column>
              <el-table-column
                prop="yuqiNum"
                label="逾期项目数（个）"
                align="center"
              >
              </el-table-column>
            </el-table>
          </div>
        </div>
      </div>
    </div>
    <div class="main">
      <div class="mainList clearfix">
        <div class="mainList_l fl">
          <head-more
            width="630"
            title="通知通告"
            @goMore="goMore('notice')"
            url="111"
          ></head-more>
          <ul class="announcementList">
            <li
              class="list_one"
              v-for="(item, idx) in noticeArr"
              :key="idx"
              @click="goNextDetails(item, 'notice')"
            >
              <span class="list_one_l">{{ item.NAME }}</span>
              <span class="list_one_r">{{ item.create_date }}</span>
            </li>
          </ul>
        </div>
        <div class="mainList_l fr">
          <head-more
            width="630"
            title="政策法规"
            @goMore="goMore('law')"
            url="222"
          ></head-more>

          <ul class="announcementList">
            <li
              class="list_one"
              v-for="(item, idx) in policiesArr"
              :key="idx"
              @click="goNextDetails(item, 'law')"
            >
              <span class="list_one_l">{{ item.NAME }}</span>
              <span class="list_one_r">{{ item.create_date }}</span>
            </li>
          </ul>
        </div>
      </div>
      <div class="aogeTables">
        <head-more
          width="1320"
          title="审批信息公开"
          @goMore="goMore('xzqhdm')"
          url="333"
          type="long"
        ></head-more>
        <div class="tableBox">
          <el-table
            :data="tableData"
            style="width: 100%"
            :header-cell-style="{
              'background-color': '#f2f2f2',
            }"
          >
            <el-table-column
              prop="xmdm"
              label="项目代码"
              width="200"
              sortable
              align="center"
              :show-overflow-tooltip="true"
            >
            </el-table-column>
            <el-table-column
              prop="xmmc"
              label="项目名称"
              width="180"
              sortable
              align="center"
              :show-overflow-tooltip="true"
            >
            </el-table-column>
            <el-table-column
              prop="name"
              label="项目所在地"
              width="160"
              sortable
              align="center"
              :show-overflow-tooltip="true"
            >
            </el-table-column>
            <el-table-column
              prop="splclxmc"
              label="审批流程类型"
              width="180"
              sortable
              align="center"
              :show-overflow-tooltip="true"
            >
            </el-table-column>
            <el-table-column
              prop="spsxmc"
              label="办理审批事项"
              width="180"
              sortable
              align="center"
              :show-overflow-tooltip="true"
            >
            </el-table-column>
            <el-table-column
              prop="blzt"
              label="办理状态"
              width="140"
              sortable
              align="center"
              :show-overflow-tooltip="true"
            >
            </el-table-column>
            <el-table-column
              prop="slsj"
              label="受理时间"
              width="140"
              sortable
              align="center"
            >
            </el-table-column>
            <el-table-column
              prop="bjsj"
              label="办结时间"
              width="140"
              sortable
              align="center"
            >
            </el-table-column>
          </el-table>
        </div>
      </div>
      <div class="aogeEcharts">
        <head-more
          width="1320"
          title="审批信息统计"
          url="333"
          type="long"
          :isMore="false"
        ></head-more>
        <div class="echartInfo">
          <div class="echartTime">
            <span>统计时间段：</span>
            <el-date-picker
              v-model="times"
              type="daterange"
              value-format="yyyy-MM-dd"
              :unlink-panels="true"
              range-separator="至"
              start-placeholder="开始日期"
              end-placeholder="结束日期"
              @change="getTimes"
            >
            </el-date-picker>
          </div>
          <div
            class="returnBtn"
            v-if="districtType != 'country'"
            @click="goReturn"
          ></div>
          <div class="xinjiang" v-if="isXinShow">
            <div class="xinjiang_list" @click="goXinjiang('650000')">
              新疆维吾尔自治区
            </div>
            <div class="xinjiang_list" @click="goXinjiang('660000')">
              新疆生产建设兵团
            </div>
          </div>
          <div id="myEchart"></div>
        </div>
      </div>
      <div class="cityEntrance">
        <div class="headerMore clearfix">
          <div class="headerMore_l fl">
            地方城市入口
          </div>
          <div class="breadList fl" v-if="isBread">
            <span>当前位置：</span>
            <span @click="goHome" class="allHome">全国</span>
            <span> &gt;</span>
            <span>{{ breadTitle }}</span>
          </div>
        </div>
        <div class="localList">
          <div
            class="city"
            v-for="(item, idx) in cityList"
            :key="idx"
            @click="goNext(item)"
            @dblclick="goPath(item.fwzxurl)"
          >
            {{ item.cityName }}
          </div>
        </div>
      </div>
    </div>
    <div class="footer">
      <div class="container">
        <div class="links clearfix">
          <div class="links_t fl">链接：</div>
          <ul class="links_c fl clearfix">
            <li class="fl"><a href="http://www.npc.gov.cn/">全国人大</a></li>
            <li class="fl"><a href="http://www.cppcc.gov.cn/">全国政协</a></li>
            <li class="fl">
              <a href="http://www.ccdi.gov.cn/">国家监察委员会</a>
            </li>
            <li class="fl">
              <a href="http://www.court.gov.cn/">最高人民法院</a>
            </li>
            <li class="fl">
              <a href="http://www.court.gov.cn/">最高人民监察院</a>
            </li>
          </ul>
        </div>
        <!-- isCountry:false,isArea:false,isInternet:false,isMeadia:false, -->
        <div class="footSelect clearfix">
          <div
            class="footSelect_one fl"
            @mouseenter="getEnter(1)"
            @mouseleave="getLeave(1)"
          >
            <span class="fl">国务院部门政务服务平台</span>
            <span class="fr"><i class="el-icon-caret-bottom"></i></span>
            <div class="countryWWW clearfix" v-show="isCountry">
              <div class="countryplace"></div>
              <div
                class="fl countryList"
                v-for="(item, idx) in countryObj"
                :key="idx"
              >
                <a :href="item.href" target="_blank">{{ item.name }}</a>
              </div>
            </div>
          </div>
          <div
            class="footSelect_one fl"
            @mouseenter="getEnter(2)"
            @mouseleave="getLeave(2)"
          >
            <span class="fl"> 地方政务服务平台</span>
            <span class="fr"><i class="el-icon-caret-bottom"></i></span>
            <div class="areaWWW clearfix" v-show="isArea">
              <div class="countryplace"></div>
              <div
                class="fl countryList"
                v-for="(item, idx) in areaObj"
                :key="idx"
              >
                <a :href="item.href" target="_blank">{{ item.name }}</a>
              </div>
            </div>
          </div>
          <div
            class="footSelect_one fl"
            @mouseenter="getEnter(3)"
            @mouseleave="getLeave(3)"
          >
            <span class="fl">国务院部门门户网站</span>
            <span class="fr"> <i class="el-icon-caret-bottom"></i></span>
            <div class="internetWWW clearfix" v-show="isInternet">
              <div class="countryplace"></div>
              <div
                class="fl countryList"
                v-for="(item, idx) in wwwObj"
                :key="idx"
              >
                <a :href="item.href" target="_blank">{{ item.name }}</a>
              </div>
            </div>
          </div>
          <div
            class="footSelect_one fl"
            @mouseenter="getEnter(4)"
            @mouseleave="getLeave(4)"
          >
            <span class="fl">媒体</span>
            <span class="fr"><i class="el-icon-caret-bottom"></i></span>
            <div class="clearfix mediawww" v-show="isMeadia">
              <div class="countryplace"></div>
              <div
                class="fl countryList"
                v-for="(item, idx) in countryObj"
                :key="idx"
              >
                <a :href="item.href" target="_blank">{{ item.name }}</a>
              </div>
            </div>
          </div>
        </div>
        <div class="footidea">
          <div class="footidea_t">
            <ul class="clearfix">
              <li class="fl">关于本网</li>
              <li class="fl">网站声明</li>
              <li class="fl">联系我们</li>
              <li class="fl">网站纠错</li>
            </ul>
          </div>
          <div class="footidea_c">
            <span>版权所有：国家政务服务平台</span>
            <span>中文域名：国家政务服务.政务</span>
            <span>国家政务服务.政务</span>
          </div>
          <div class="footidea_c">
            <span>主办单位：国务院办公厅</span>
            <span>运行维护单位：国务院办公厅电子政务办公室</span>
          </div>
          <div class="footidea_c">
            <span>京ICP备05070218号-3</span>
            <span>京公网安备 11010202001001号</span>
          </div>
          <div class="footidea_c">
            <span
              >建议您使用IE9及以上版本、Edge、chrome、firedox、和360等主流浏览器浏览本网站</span
            >
            <span>京公网安备 11010202001001号</span>
          </div>
        </div>
      </div>
    </div>
    <!-- 表格弹窗 -->
    <el-dialog :title="moreTitle" :visible.sync="dialogTableVisible">
      <div class="cityAverage" v-if="isCityAverage">
        <div>
          <el-table
            :data="averageMoreData"
            style="width: 100%"
            border
            :header-cell-style="{
              'background-color': '#FFEEEF',
              'border-top': '1px solid #E9EAF2',
              color: '#333333',
            }"
          >
            <el-table-column
              type="index"
              width="80"
              label="排名"
              align="center"
            >
            </el-table-column>
            <el-table-column
              prop="CITY_NAME"
              label="城市"
              align="center"
              width="120"
            >
            </el-table-column>
            <el-table-column
              prop="TOTAL_CNT"
              label="审批平均总用时（天）"
              align="center"
            >
            </el-table-column>
          </el-table>
        </div>
        <div
          v-if="averageMoreData.length > 0"
          style="text-align:center;margin-top:16px;"
        >
          <el-pagination
            @current-change="averageChange"
            :current-page.sync="averagePage"
            :page-size="averageSize"
            layout="total, prev, pager, next"
            :total="averageTotal"
          >
          </el-pagination>
        </div>
      </div>
      <div class="proviceOverdue" v-if="isProviceOverdue">
        <div>
          <el-table
            :data="overdueMoreData"
            style="width: 100%"
            border
            :header-cell-style="{
              'background-color': '#FFEEEF',
              'border-top': '1px solid #E9EAF2',
              color: '#333333',
            }"
          >
            <el-table-column
              type="index"
              width="80"
              label="排名"
              align="center"
            ></el-table-column>
            <el-table-column
              prop="cityName"
              label="城市"
              align="center"
              width="120"
            >
            </el-table-column>
            <el-table-column
              prop="itemTotal"
              label="项目总数（个）"
              align="center"
            >
            </el-table-column>
            <el-table-column
              prop="yuqiNum"
              label="逾期项目数（个）"
              align="center"
            >
            </el-table-column>
          </el-table>
        </div>
        <div
          v-if="overdueMoreData.length > 0"
          style="text-align:center;margin-top:16px;"
        >
          <el-pagination
            @current-change="overdueChange"
            :current-page.sync="overduePage"
            :page-size="overdueSize"
            layout="total, prev, pager, next"
            :total="overdueTotal"
          >
          </el-pagination>
        </div>
      </div>
    </el-dialog>
  </div>
</template>

<script>
import headMore from "@/components/headMore/headMore.vue";
export default {
  name: "Home",
  data() {
    return {
      noticeArr: [],
      policiesArr: [],
      averageTimeData: [],
      overdueData: [],
      tableData: [],
      curMap: {},
      mapStack: [], //将上一级地图信息压入mapStack
      myChart: null, //全局初始化地图变量
      times: [],
      startTime: "", //
      endTime: "", //
      projectNumObj: {
        SPJDXH1: 0,
        SPJDXH2: 0,
        SPJDXH3: 0,
        SPJDXH4: 0,
        SPJDXH5: 0,
      }, //阶段项目数
      xzqhdm: "", //行政区域代码
      XZQHDM: "", //用于地方申请专用，不参与地图的联动
      cityList: [], //地方城市数组
      mapName: "china",
      districtType: "country",
      isCountry: false,
      isArea: false,
      isInternet: false,
      isMeadia: false,
      entranceType: "country",
      isBread: false,
      breadTitle: "",
      dialogTableVisible: false, //弹窗控制
      isCityAverage: false,
      isProviceOverdue: false,
      averageMoreData: [], //表格弹窗详细数据
      overdueMoreData: [],
      averagePage: 1,
      averageSize: 10,
      averageTotal: 32,
      overduePage: 1,
      overdueSize: 10,
      overdueTotal: 32,
      moreTitle: "各城市审批平均总用时排名", //更多弹窗标题
      countryObj: [
        {
          href: "https://services.ndrc.gov.cn:9443/",
          name: "国家发展和改革委员会",
        },
        { href: "http://zwfw.moe.gov.cn/#/", name: "教育部" },
        { href: "https://fuwu.most.gov.cn/", name: "科学技术部" },
        {
          href:
            "https://zwfwsso.miit.gov.cn/sso/nationalUnity?service=https://zwfw.miit.gov.cn/site/user/bussnessMain",
          name: "工业和信息化部",
        },
        { href: "http://www.mps.gov.cn/n2256342/index.html", name: "公安部" },
        { href: "http://www.mca.gov.cn/article/fw/", name: "民政部" },
        { href: "http://zwfw.12348.gov.cn/", name: "司法部" },
        { href: "http://zwfw.mof.gov.cn/", name: "财政部" },
        { href: "http://www.12333.gov.cn/", name: "人力资源和社会保障部" },
        { href: "http://zwfw.mnr.gov.cn/", name: "自然资源部" },
        { href: "http://zwfw.mee.gov.cn", name: "生态环境部" },
        {
          href: "http://www.mohurd.gov.cn/wbdt/index.html",
          name: "住房和城乡建设部",
        },
        { href: "http://zwfw.mot.gov.cn/", name: "交通运输部" },
        { href: "http://spjc.mwr.gov.cn", name: "水利部" },
        { href: "http://zwfw.moa.gov.cn", name: "农业农村部" },
        { href: "https://egov.mofcom.gov.cn/", name: "商务部" },
        { href: "https://zwfw.mct.gov.cn/index", name: "文化和旅游部" },
        {
          href: "http://www.nhc.gov.cn/wjw/fuw/fuwu.shtml",
          name: "国家卫生健康委员会",
        },
        {
          href: "http://fwpt.mva.gov.cn:49633/mvawww/#/index",
          name: "退役军人事务部",
        },
        { href: "https://zwfw.mem.gov.cn", name: "应急管理部" },
        {
          href: "http://xzxk.pbc.gov.cn/opal/TaskDispatchServlet",
          name: "人民银行",
        },
        { href: "http://online.customs.gov.cn/", name: "海关总署" },
        {
          href: "http://www.chinatax.gov.cn/n810346/index.html",
          name: "国家税务总局",
        },
        { href: "http://www.samr.gov.cn/fw/", name: "国家市场监督管理总局" },
        { href: "https://zw.nrta.gov.cn/", name: "国家广播电视总局" },
        { href: "https://zwfw.sport.gov.cn/", name: "国家体育总局" },
        { href: "http://www.stats.gov.cn/tjfw/", name: "国家统计局" },
        { href: "http://www.nhsa.gov.cn/", name: "国家医疗保障局" },
        { href: "http://www.ggj.gov.cn/zwfwdto/", name: "国家机关事务管理局" },
        { href: "https://zwfw.cma.gov.cn", name: "中国气象局" },
        {
          href: "http://zwfw.cbirc.gov.cn/",
          name: "中国银行保险监督管理委员会",
        },
        {
          href: "http://neris.csrc.gov.cn/portal",
          name: "中国证券监督管理委员会",
        },
        {
          href: "http://106.3.145.78:49879/dtglxt/gov/govCheckLogin",
          name: "国家粮食和物资储备局",
        },
        { href: "http://www.nea.gov.cn/", name: "国家能源局" },
        {
          href:
            "http://www.sastind.gov.cn/n6195634/n6195706/n6195716/index.html",
          name: "国家国防科技工业局",
        },
        {
          href: "https://zwfwdt.tobacco.gov.cn/cooperativeWeb/event/tab",
          name: "国家烟草专卖局",
        },
        { href: "https://s.nia.gov.cn/", name: "国家移民管理局" },
        {
          href: "http://www.forestry.gov.cn/xzsp.html",
          name: "国家林业和草原局",
        },
        { href: "https://zwfw.nra.gov.cn/", name: "国家铁路局" },
        { href: "http://www.caac.gov.cn/FWDT/", name: "中国民用航空局" },
        { href: "https://zwfw.spb.gov.cn", name: "国家邮政局" },
        { href: "http://gl.ncha.gov.cn", name: "国家文物局" },
        { href: "http://zwfw.safe.gov.cn/asone", name: "国家外汇管理局" },
        {
          href: "https://zwfw.nmpa.gov.cn/web/index?loginTrust=index",
          name: "国家药品监督管理局",
        },
        {
          href: "https://www.cnipa.gov.cn/col/col1510/index.html",
          name: "国家知识产权局",
        },
        {
          href: "http://www.oscca.gov.cn/sca/zxfw/index.shtml",
          name: "国家密码管理局",
        },
      ],
      areaObj: [
        { code: "11", href: "http://beijing.gjzwfw.gov.cn", name: "北京市" },
        { code: "12", href: "http://tj.gjzwfw.gov.cn", name: "天津市" },
        { code: "13", href: "http://hbzwfw.gjzwfw.gov.cn", name: "河北省" },
        { code: "14", href: "http://sxzwfw.gjzwfw.gov.cn", name: "山西省" },
        { code: "15", href: "http://nmg.gjzwfw.gov.cn", name: "内蒙古自治区" },
        { code: "21", href: "http://lnzwfw.gjzwfw.gov.cn", name: "辽宁省" },
        { code: "22", href: "http://jlzwfw.gjzwfw.gov.cn", name: "吉林省" },
        { code: "23", href: "http://hljzwzx.gjzwfw.gov.cn", name: "黑龙江省" },
        { code: "31", href: "http://sh.gjzwfw.gov.cn", name: "上海市" },
        { code: "32", href: "http://jszwfw.gjzwfw.gov.cn", name: "江苏省" },
        { code: "33", href: "http://zjzwfw.gjzwfw.gov.cn", name: "浙江省" },
        { code: "34", href: "http://ahzwfw.gjzwfw.gov.cn", name: "安徽省" },
        { code: "35", href: "http://fjbs.gjzwfw.gov.cn", name: "福建省" },
        { code: "36", href: "http://jxzwfww.gjzwfw.gov.cn", name: "江西省" },
        { code: "37", href: "http://sd.gjzwfw.gov.cn", name: "山东省" },
        { code: "41", href: "http://hnzwfw.gjzwfw.gov.cn", name: "河南省" },
        { code: "42", href: "http://hubei.gjzwfw.gov.cn", name: "湖北省" },
        { code: "43", href: "http://hunan.gjzwfw.gov.cn", name: "湖南省" },
        { code: "44", href: "http://gdzwfw.gjzwfw.gov.cn", name: "广东省" },
        {
          code: "45",
          href: "http://gxzf.gjzwfw.gov.cn",
          name: "广西壮族自治区",
        },
        { code: "46", href: "http://hainan.gjzwfw.gov.cn", name: "海南省" },
        { code: "50", href: "http://cq.gjzwfw.gov.cn", name: "重庆市" },
        { code: "51", href: "http://sczwfw.gjzwfw.gov.cn", name: "四川省" },
        { code: "52", href: "http://gzegn.gjzwfw.gov.cn", name: "贵州省" },
        { code: "53", href: "http://yn.gjzwfw.gov.cn", name: "云南省" },
        { code: "54", href: "http://xzzwfw.gjzwfw.gov.cn", name: "西藏自治区" },
        { code: "61", href: "http://shaanxi.gjzwfw.gov.cn", name: "陕西省" },
        { code: "62", href: "http://gszwfw.gjzwfw.gov.cn", name: "甘肃省" },
        { code: "63", href: "http://qhzwfw.gjzwfw.gov.cn", name: "青海省" },
        { code: "64", href: "http://nx.gjzwfw.gov.cn", name: "宁夏回族自治区" },
        {
          code: "64",
          href: "http://xinjiang.gjzwfw.gov.cn",
          name: "新疆维吾尔自治区",
        },
        {
          code: "",
          href: "http://xjbt.gjzwfw.gov.cn",
          name: "新疆生产建设兵团",
        },
      ],
      wwwObj: [
        {
          href:
            "http://paper.people.com.cn/rmrb/html/2019-09/06/nbs.D110000renmrb_01.htm",
          name: "人民日报",
        },
        { href: "http://www.xinhuanet.com/", name: "新华社" },
        { href: "http://epaper.gmw.cn/", name: "光明日报" },
        { href: "http://paper.ce.cn/", name: "经济日报" },
        { href: "http://www.cnr.cn/", name: "中央人民广播电台" },
        { href: "http://www.cctv.com/", name: "中央电视台" },
        { href: "http://www.cctv.com/", name: "中国国际广播电台" },
        { href: "http://www.chinadaily.com.cn/", name: "中国日报" },
        { href: "http://zqb.cyol.com/", name: "中国青年报" },
        { href: "http://www.people.com.cn/", name: "人民网" },
        { href: "http://www.news.cn", name: "新华网" },
        { href: "http://www.china.com.cn/", name: "中国网" },
        { href: "http://www.cctv.com/", name: "央视网" },
        { href: "http://www.chinadaily.com.cn/", name: "中国日报网" },
        { href: "http://www.cri.cn/index.html", name: "国际在线" },
        { href: "http://www.youth.cn/", name: "中国青年网" },
        { href: "http://www.ce.cn/", name: "中国经济网" },
        { href: "http://www.chinanews.com/", name: "中国新闻网" },
      ],
      timeClickFn: null,
      timer: null, //定时器
      isXinShow: false,
    };
  },
  components: {
    headMore,
  },
  created() {
    var dates = new Date();
    var startDate = dates.getFullYear() + "-01-01";
    var endDate = window.Tools.formatTime(dates, true, "-");
    this.times = [startDate, endDate];
    this.startTime = startDate;
    this.endTime = endDate;
    this.getNoticeList();
    this.getPoliciesList();
    this.getTableList();
    this.getCityList();
    this.getProviceRankData();
    this.getOverdueData();
    this.getProjectNum();
  },
  mounted() {
    // 地图相关
    var that = this;
    this.myChart = this.$echarts.init(document.getElementById("myEchart"));
    //地图鼠标移动 高亮不显示
    this.myChart.on("mouseover", function(params) {
      if (params.data && params.data.districtType == "city") {
        that.myChart.dispatchAction({
          type: "downplay",
        });
      }
    });
    //地图单击事件
    this.myChart.on("click", function(params) {
      if (params.data && params.data.districtType != "area") {
        that.clickEvent(params);
      }
    });
    this.loadMap();
  },
  methods: {
    goCountrySearch() {
      this.getProviceRankData();
      this.getOverdueData();
      this.getProjectNum();
    },
    goProviceMore(type) {
      var that = this;
      that.dialogTableVisible = true;
      if (type == 1) {
        that.moreTitle = "各城市审批平均总用时排名";
        that.isCityAverage = true;
        that.isProviceOverdue = false;
        that.getMoreProviceRankData();
      } else if (type == 2) {
        that.moreTitle = "各省逾期项目数排名";
        that.isProviceOverdue = true;
        that.isCityAverage = false;
        that.getMoreOverdueData();
      }
    },
    //获取省平均排名表格数据
    getMoreProviceRankData() {
      var that = this;
      var params = {
        "page.pageSize": that.averageSize,
        "page.pageNo": that.averagePage,
        totalFlag: false,
        tjkssj: that.startTime,
        tjjssj: that.endTime,
      };
      that.$client
        .post("/portal!getCityAuditAverageTotaTimesRank.action", params)
        .then(function(res) {
          console.log("更多省排名", res);
          if (res.data) {
            that.averageMoreData = res.data;
          }
        });
    },
    //获取审批逾期表格数据
    getMoreOverdueData() {
      var that = this;
      var params = {
        "page.pageSize": that.averageSize,
        "page.pageNo": that.overduePage,
        totalFlag: false,
        tjkssj: that.startTime,
        tjjssj: that.endTime,
      };
      that.$client
        .post("/portal!getNationOverdueProjectCntRank.action", params)
        .then(function(res) {
          console.log("更多省逾期", res);
          if (res.data) {
            that.overdueMoreData = res.data;
          }
        });
    },
    goMore(info) {
      var that = this;
      if (info == "notice") {
        this.$router.push({
          path: "/details",
          query: {
            type: "notice",
            code: "PORTAL_NOTICE",
          },
        });
      } else if (info == "law") {
        this.$router.push({
          path: "/details",
          query: {
            type: "law",
            code: "PORTAL_LAW",
          },
        });
      } else if (info == "xzqhdm") {
        this.$router.push({
          path: "/details",
          query: {
            code: that.xzqhdm,
            type: "table",
          },
        });
      }
    },
    averageChange(val) {
      console.log("分页", val);
      this.averagePage = val;
      this.getMoreProviceRankData();
    },
    overdueChange(val) {
      this.overduePage = val;
      this.getMoreOverdueData();
    },
    //获取通告
    getNoticeList() {
      var that = this;
      var params = {
        pageNum: 1,
        pageSize: 7,
        item: "PORTAL_NOTICE",
        type: "notice",
      };
      that.$client
        .post("/portal!getPoliciesOrNoticesData.do", params)
        .then(function(res) {
          console.log("通告结果：", res);
          if (res.code == 200) {
            that.noticeArr = res.data.content || [];
          } else {
            // 请求失败
          }
        });
    },
    //获取政策法规
    getPoliciesList() {
      var that = this;
      var params = {
        pageNum: 1,
        pageSize: 7,
        item: "PORTAL_LAW",
        type: "law",
      };
      that.$client
        .post("/portal!getPoliciesOrNoticesData.do", params)
        .then(function(res) {
          console.log("政策结果：", res);
          if (res.code == 200) {
            that.policiesArr = res.data.content || [];
          } else {
            // 请求失败
          }
        });
    },
    //获取审批信息公开表格数据
    getTableList() {
      var that = this;
      var dates = new Date();
      var startDate = that.times[0]
        ? that.times[0]
        : dates.getFullYear() + "-01-01";
      var endDate = that.times[1]
        ? that.times[1]
        : window.Tools.formatTime(dates, true, "-");
      var params = {
        pageNum: 1,
        pageSize: 10,
        xzqhdm: that.xzqhdm,
        startDate: startDate,
        endDate: endDate,
      };
      that.$client
        .post("/portal!getApprovalPublishedInfo.do", params)
        .then(function(res) {
          console.log("表格结果：", res);
          if (res.code == 200) {
            that.tableData = res.data.content || [];
          } else {
            // 请求失败
          }
        });
    },
    //获取省平均排名表格数据
    getProviceRankData() {
      var that = this;
      var params = {
        "page.pageSize": 5,
        "page.pageNo": 1,
        totalFlag: false,
        tjkssj: that.startTime,
        tjjssj: that.endTime,
      };
      that.$client
        .post("/portal!getCityAuditAverageTotaTimesRank.action", params)
        .then(function(res) {
          console.log("省排名", res);
          if (res.data) {
            that.averageTimeData = res.data || [];
          }
        });
    },
    //获取审批逾期表格数据
    getOverdueData() {
      var that = this;
      var params = {
        "page.pageSize": 5,
        "page.pageNo": 1,
        totalFlag: false,
        tjkssj: that.startTime,
        tjjssj: that.endTime,
      };
      that.$client
        .post("/portal!getNationOverdueProjectCntRank.action", params)
        .then(function(res) {
          console.log("省逾期", res);
          if (res.data) {
            that.overdueData = res.data || [];
          }
        });
    },
    getProjectNum() {
      var that = this;
      var mouthTime = this.getmonthDate();
      console.log("时间：", mouthTime);
      var params = {
        tjkssj: mouthTime.start_day,
        tjjssj: mouthTime.end_day,
      };
      that.$client
        .post("/portal!getNationStageProjectCnt.action", params)
        .then(function(res) {
          if (res.TOTAL) {
            that.projectNumObj.SPJDXH1 = res.SPJDXH1 || 0;
            that.projectNumObj.SPJDXH2 = res.SPJDXH2 || 0;
            that.projectNumObj.SPJDXH3 = res.SPJDXH3 || 0;
            that.projectNumObj.SPJDXH4 = res.SPJDXH4 || 0;
            that.projectNumObj.SPJDXH5 = res.SPJDXH5 || 0;
          }
        });
    },
    getmonthDate() {
      var monthDate = {};
      var now = new Date(); //当前日期
      var startMonth = null; //当前月
      console.log("-----", this.startTime);
      var startYear = this.startTime.substring(0, 4); //当前年
      var endMonth = null;
      var endYear = this.endTime.substring(0, 4);

      if (this.startTime.substring(5, 6) == "0") {
        startMonth = this.startTime.substring(6, 7) - 1;
      } else {
        startMonth = this.startTime.substring(5, 7) - 1;
      }
      if (this.endTime.substring(5, 6) == "0") {
        endMonth = this.endTime.substring(6, 7) * 1;
      } else {
        endMonth = this.endTime.substring(5, 7) * 1;
      }
      console.log("startMonth", startMonth, endMonth, startYear);
      //本月的开始时间
      var monthStartDate = new Date(startYear, startMonth, 1);
      var yy = monthStartDate.getFullYear() + "-";
      var mm =
        (monthStartDate.getMonth() + 1 < 10
          ? "0" + (monthStartDate.getMonth() + 1)
          : monthStartDate.getMonth() + 1) + "-";
      var dd =
        monthStartDate.getDate() < 10
          ? "0" + monthStartDate.getDate()
          : monthStartDate.getDate();
      //本月的结束时间
      var monthEndDate = new Date(endYear, endMonth, 0);
      var YY = monthEndDate.getFullYear() + "-";
      var MM =
        (monthEndDate.getMonth() + 1 < 10
          ? "0" + (monthEndDate.getMonth() + 1)
          : monthEndDate.getMonth() + 1) + "-";
      var DD =
        monthEndDate.getDate() < 10
          ? "0" + monthEndDate.getDate()
          : monthEndDate.getDate();
      monthDate.start_day = yy + mm + dd;
      monthDate.end_day = YY + MM + DD;
      return monthDate;
    },
    /**
     * 加载地图
     * @param mapName 注册的地图名称
     * @param xzqhdm 行政区划代码 全国显示时为null或'',其他为对应的行政区划代码
     * @param districtType 区域类型 1.country:为国家 2.province：为省 3.city：为市
     */
    loadMap() {
      var that = this;
      var mapName = that.mapName;
      var xzqhdm = that.xzqhdm;
      var districtType = that.districtType;
      var dates = new Date();
      var startDate = that.times[0]
        ? that.times[0]
        : dates.getFullYear() + "-01-01";
      var endDate = that.times[1]
        ? that.times[1]
        : window.Tools.formatTime(dates, true, "-");
      var params = {
        xzqhdm: that.xzqhdm,
        startDate: startDate,
        endDate: endDate,
      };
      that.myChart.showLoading();
      that.$client
        .post("/portal!getApprovalCount.do", params)
        .then(function(res) {
          console.log("地图数据", res);
          if (res.code == 200) {
            that.myChart.hideLoading();
            that.loadMapByJson(res.data, mapName, xzqhdm, districtType);
          } else {
            // 请求失败
          }
        });
    },
    loadMapByJson(result, mapName, xzqhdm, districtType) {
      var that = this;
      var url;
      if (districtType == "country") {
        url = "abbrMapJson/china.json";
      } else if (districtType == "province") {
        url = "abbrMapJson/province/" + xzqhdm.substring(0, 2) + ".json";
      } else {
        url = "abbrMapJson/city/" + xzqhdm + ".json";
      }
      var max = result[0].value == 0 ? 100 : result[0].value;

      this.$client.getJson(url).then(function(res) {
        if (res.features) {
          that.curMap = {
            mapXzqhdm: xzqhdm,
            mapName: mapName,
            districtType: districtType,
          };

          that.$echarts.registerMap(mapName, res); //注册地图
          //清除myChart
          that.myChart.clear();
          that.myChart.setOption({
            tooltip: {
              //鼠标悬浮时区域提示框
              trigger: "item",
              formatter: function(params) {
                if (isNaN(params.value)) {
                  //没有数据时显示-
                  if (params.data != undefined) {
                    return (
                      params.data.fullName +
                      "<br/>项目数：- 个" +
                      "<br/>办件数：- 个"
                    );
                  }
                } else {
                  return (
                    params.data.fullName +
                    "<br/>项目数：" +
                    params.data.value +
                    " 个" +
                    "<br/>办件数：" +
                    params.data.sxs +
                    " 个"
                  );
                }
              },
            },
            visualMap: {
              min: 0,
              max: max,
              text: ["高", "低"],
              realtime: false,
              calculable: false,
              inRange: {
                color: ["#E1E9F4", "#C1D3E9", "#9EBBDD", "#588AC5"],
              },
            },
            series: [
              {
                type: "map",
                mapType: mapName,
                label: {
                  show: true,
                },
                data: result,
              },
            ],
          });
        } else {
          //请求失败的情况
        }
      });
    },
    getTimes(value) {
      // 获取时间
      var that = this;
      console.log("时间：", value, this.times);
      that.getTableList();
      that.loadMap();
    },
    getEnter(type) {
      if (type == 1) {
        this.isCountry = true;
      } else if (type == 2) {
        this.isArea = true;
      } else if (type == 3) {
        this.isInternet = true;
      } else if (type == 4) {
        this.isMeadia = true;
      }
    },
    getLeave(type) {
      if (type == 1) {
        this.isCountry = false;
      } else if (type == 2) {
        this.isArea = false;
      } else if (type == 3) {
        this.isInternet = false;
      } else if (type == 4) {
        this.isMeadia = false;
      }
    },
    /**
     * 地图单击事件
     */
    clickEvent(params) {
      var that = this;
      console.log("地图点击:", params);
      // return;
      if (that.timeClickFn) {
        //取消上次延时未执行的方法
        that.imeClickFn = clearTimeout(that.timeClickFn);
      }
      that.timeClickFn = setTimeout(function() {
        if (params.data != undefined) {
          that.mapName = params.data.name;
          var mapXzqhdm = "";
          that.districtType = params.data.districtType;
          if (that.districtType == "province") {
            //点击省(除直辖市)
            if (params.data.province == "650000") {
              console.log("进来了吗");
              that.isXinShow = true;
              return;
            } else {
              that.xzqhdm = params.data.province;
              mapXzqhdm = params.data.province;
            }
          } else if (
            that.districtType == "city" ||
            that.districtType == "municipality"
          ) {
            that.xzqhdm = params.data.city;
            mapXzqhdm = params.data.city;
          }
          that.loadMap();
          that.getTableList();
          //将上一级地图信息压入mapStack
          that.mapStack.push(that.curMap);
        }
      }, 200); //延迟200毫秒执行
    },
    //返回上一级地图
    goReturn() {
      var that = this;
      console.log(222222222);
      var map = that.mapStack.pop();
      that.mapName = map.mapName;
      that.xzqhdm = map.mapXzqhdm;
      that.districtType = map.districtType;
      that.loadMap();
      that.getTableList();
    },
    // 地方申报接口
    getCityList() {
      var that = this;
      that.$client
        .post("/portal!getDeclareUrl.do", {
          xzqhdm: that.XZQHDM,
        })
        .then(function(res) {
          console.log("地方申请数据：", res);
          if (res.code == 200) {
            that.cityList = res.data || [];
          } else {
            // 请求失败
          }
        });
    },
    //去地方入口下一级
    goNext(info) {
      var that = this;
      clearTimeout(that.timer);
      that.timer = setTimeout(function() {
        that.XZQHDM = info.xzqhdm;
        var zxsArr = ["110000", "120000", "310000", "500000"];
        if (zxsArr.indexOf(info.xzqhdm) != -1 || that.entranceType == "city") {
          //直辖市,以及其他市级
          if (info.fwzxurl) {
            var tempwindow = window.open("_blank");
            tempwindow.location = info.fwzxurl;
          } else {
            //功能暂未开放
          }
        } else {
          that.entranceType = "city";
          that.isBread = true;
          that.breadTitle = info.cityName;
          that.getCityList();
        }
      }, 500);
    },
    //地方入口双击事件
    goPath(url) {
      var that = this;
      console.log("双击事件");
      clearTimeout(that.timer);
      if (that.entranceType == "city") {
        //城市没有双击事件
      } else {
        if (url) {
          var tempwindow = window.open("_blank");
          tempwindow.location = url;
        } else {
          //功能暂未开放
        }
      }
    },
    goHome() {
      window.location.reload();
    },
    goXinjiang(id) {
      var that = this;
      that.isXinShow = false;
      that.xzqhdm = id;
      that.loadMap();
      that.getTableList();
      //将上一级地图信息压入mapStack
      that.mapStack.push(that.curMap);
    },
    goNextDetails(info, type) {
      if (info.url) {
        var tempwindow = window.open("_blank");
        tempwindow.location = info.url;
      } else {
        if (type == "notice") {
          this.$router.push({
            path: "/listDetails",
            query: {
              fileId: info.id,
              type: type,
              isShowFile:info.isShowFile
            },
          });
        } else {
          this.$router.push({
            path: "/listDetails",
            query: {
              fileId: info.id,
              type: type,
              isShowFile:info.isShowFile
            },
          });
        }
      }
    },
  },
};
</script>
<style lang="less" scoped>
.index {
  width: 100%;
  .header {
    height: 12px;
    background: #a1050d;
    width: 100%;
  }
  .title {
    height: 142px;
    width: 1320px;
    margin: 0 auto;
    padding: 20px 10px;
    box-sizing: border-box;
    position: relative;
    .logo {
      width: 87px;
      img {
        display: block;
        width: 87px;
      }
    }
    .logo_title {
      margin-left: 15px;
      .logo_title_t {
        width: 302px;
        height: 25px;
        background: #c6040d;
        color: #fff;
        letter-spacing: 6px;
        padding: 0 8px;
        box-sizing: border-box;
        line-height: 25px;
      }
      .logo_title_c {
        font-size: 33px;
        font-weight: 800;
        margin-top: 10px;
      }
      .logo_title_b {
        font-size: 18px;
        font-weight: 800;
        margin-top: 8px;
      }
    }
    .nav-ul {
      position: absolute;
      right: 0;
      bottom: 20px;
      .list {
        float: left;
        margin-right: 15px;
        cursor: pointer;
        a {
          font-size: 20px;
          font-weight: 800;
          color: #333;
        }
      }
    }
  }
  .banana {
    height: 480px;
    width: 100%;
    img {
      width: 100%;
      height: 100%;
    }
  }
  .newBox {
    width: 1320px;
    margin: 0 auto;
    padding: 46px 10px 0 10px;
    .countryNum {
      .countryHeader {
        border-bottom: 2px solid #bc020f;
        padding-bottom: 1px;
        width: 1320px;
        .countryHeader_l {
          background: url(../assets/image/title4.png);
          width: 287px;
          height: 49px;
          background-repeat: no-repeat;
          font-size: 28px;
          color: #fff;
          font-weight: 800;
          padding: 10px 17px;
          box-sizing: border-box;
        }
        .countryHeader_r {
          .countryBtn {
            margin-left: 16px;
            width: 95px;
            height: 38px;
            border: 1px solid #dcdfe6;
            line-height: 38px;
            text-align: center;
            cursor: pointer;
            background: #fff;
            font-size: 18px;
            font-weight: 400;
            color: #bc040f;
            display: inline-block;
            border-radius: 5px;
          }
        }
      }
      .countryBox {
        display: flex;
        justify-content: space-around;
        margin: 24px 0 46px 0;
        .countryList {
          width: 232px;
          height: 230px;
          box-sizing: border-box;
          padding-top:22px;
          border: 1px solid #e5e5e5;
          img {
            display: block;
            margin: 0 auto;
          }
          h2 {
            text-align: center;
            height: 30px;
            font-size: 30px;
            font-weight: 500;
            color: #333333;
            margin-top: 24px;
          }
          h4 {
            text-align: center;
            height: 16px;
            font-size: 16px;
            font-weight: 400;
            color: #666666;
            margin-top: 12px;
          }
        }
      }
    }
    .provinceRank {
      margin-top: 40px;
      .averageTimeBox {
        .averageTimeHeader {
          width: 630px;
          border-bottom: 2px solid #bc020f;
          padding-bottom: 1px;
          .averageTimeHeader_l {
            background: url(../assets/image/title3.png);
            width: 384px;
            height: 49px;
            background-repeat: no-repeat;
            font-size: 28px;
            color: #fff;
            font-weight: 800;
            padding: 10px 17px;
            box-sizing: border-box;
          }
          .averageTimeHeader_r {
            color: #ceba98;
            font-size: 20px;
            cursor: pointer;
            margin-top: 20px;
          }
        }
        .averageTimeTable {
          margin-top: 5px;
        }
      }
      .overdueBox {
        .overdueHeader {
          width: 630px;
          border-bottom: 2px solid #bc020f;
          padding-bottom: 1px;
          .overdueHeader_l {
            background: url(../assets/image/title2.png);
            width: 335px;
            height: 49px;
            background-repeat: no-repeat;
            font-size: 28px;
            color: #fff;
            font-weight: 800;
            padding: 10px 17px;
            box-sizing: border-box;
          }
          .overdueHeader_r {
            color: #ceba98;
            font-size: 20px;
            cursor: pointer;
            margin-top: 20px;
          }
        }
        .overdueTable {
          margin-top: 5px;
        }
      }
    }
  }
  .main {
    width: 1320px;
    margin: 0 auto;
    padding: 60px 10px;
    .announcementList {
      margin-top: 20px;
      .list_one {
        margin-bottom: 38px;
        height: 28px;
        .list_one_l {
          width: 500px;
          overflow: hidden;
          text-overflow: ellipsis;
          white-space: nowrap;
          display: inline-block;
          vertical-align: bottom;
          margin-right: 6px;
          color: #333;
          font-size: 20px;
          line-height: 28px;
          cursor: pointer;
        }
        .list_one_r {
          width: 117px;
          display: inline-block;
          padding-left: 7px;
          color: #999;
          font-size: 20px;
          cursor: pointer;
          line-height: 28px;
        }
      }
    }
    .aogeTables {
      width: 100%;
      .tableBox {
        margin-top: 12px;
      }
    }
    .aogeEcharts {
      margin-top: 32px;
      .echartInfo {
        width: 100%;
        height: 1040px;
        margin-top: 32px;
        border: 1px solid #e0e0e0;
        position: relative;
        .returnBtn {
          background: url(../assets/image/back.png) no-repeat center center;
          width: 32px;
          height: 32px;
          position: absolute;
          right: 16px;
          top: 16px;
        }
        .echartTime {
          padding-left: 24px;
          padding-top: 12px;
        }
        #myEchart {
          width: 100%;
          height: 985px;
          position: relative;
        }
        .xinjiang {
          position: absolute;
          top: 43%;
          left: 18%;
          z-index: 1000;
          min-width: 160px;
          padding: 5px 0;
          margin: 2px 0 0;
          font-size: 14px;
          text-align: left;
          background-color: #fff;
          -webkit-background-clip: padding-box;
          background-clip: padding-box;
          border: 1px solid #ccc;
          border: 1px solid rgba(0, 0, 0, 0.15);
          border-radius: 4px;
          -webkit-box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
          box-shadow: 0 6px 12px rgba(0, 0, 0, 0.175);
          .xinjiang_list {
            padding: 3px 20px;
            cursor: pointer;
            font-weight: 400;
            line-height: 1.5;
            color: #333;
            white-space: nowrap;
          }
          .xinjiang_list:hover {
            background: #fff;
            color: #545a6c;
          }
        }
      }
    }
    .cityEntrance {
      margin-top: 32px;
      .headerMore {
        width: 1320px;
        border-bottom: 2px solid #bc020f;
        .headerMore_l {
          background: url(../assets/image/title2.jpg);
          width: 223px;
          height: 49px;
          background-repeat: no-repeat;
          font-size: 28px;
          color: #fff;
          font-weight: 800;
          padding: 10px 17px;
          box-sizing: border-box;
        }
        .breadList {
          color: #be030e;
          padding-top: 16px;
          margin-left: 32px;
          span {
            font-size: 24px;
            padding: 0 4px;
          }
          .allHome {
            cursor: pointer;
          }
        }
        .headerMore_r {
          color: #ceba98;
          font-size: 20px;
          cursor: pointer;
          margin-top: 20px;
        }
      }

      .localList {
        margin-top: 16px;
        .city {
          width: 200px;
          height: 54px;
          background: #f0f0f0;
          margin-right: 20px;
          margin-bottom: 14px;
          display: inline-block;
          text-align: center;
          line-height: 54px;
          font-size: 18px;
          cursor: pointer;
        }
      }
    }
  }
  .footer {
    height: 330px;
    width: 100%;
    background: #111e3b;
    color: #fff;
    .container {
      width: 1320px;
      margin: 0 auto;
      .links {
        padding: 30px;
        .links_t {
          font-size: 14px;
        }
        .links_c {
          li {
            margin-right: 10px;
            padding: 0 20px;
            border-right: 2px solid #eee;
            a {
              color: #fff;
            }
          }
        }
      }
      .footSelect {
        width: 100%;
        height: 47px;
        .footSelect_one {
          width: 308px;
          height: 47px;
          background: #ffffff38;
          line-height: 47px;
          padding-left: 10px;
          padding-right: 10px;
          box-sizing: border-box;
          margin-right: 5px;
          position: relative;
          .countryWWW {
            position: absolute;
            bottom: 60px;
            background: #454f66;
            left: 0;
            width: 1090px;
            padding: 10px;
            z-index: 999;
            .countryplace {
              position: absolute;
              width: 308px;
              height: 15px;
              background: #454f66;
              bottom: -14px;
              left: 0;
            }
            .countryList {
              width: 24%;
              background: transparent;
              line-height: 32px;
              height: 32px;
              a {
                color: #fff;
              }
            }
          }
          .areaWWW {
            position: absolute;
            bottom: 60px;
            background: #454f66;
            left: -174px;
            width: 1090px;
            padding: 10px;
            z-index: 999;
            .countryplace {
              position: absolute;
              width: 308px;
              height: 15px;
              background: #454f66;
              bottom: -14px;
              left: 174px;
            }
            .countryList {
              width: 24%;
              background: transparent;
              line-height: 32px;
              height: 32px;
              a {
                color: #fff;
              }
            }
          }
          .internetWWW {
            position: absolute;
            bottom: 60px;
            background: #454f66;
            right: -174px;
            width: 1090px;
            padding: 10px;
            z-index: 999;
            .countryplace {
              position: absolute;
              width: 308px;
              height: 15px;
              background: #454f66;
              bottom: -14px;
              right: 174px;
            }
            .countryList {
              width: 24%;
              background: transparent;
              line-height: 32px;
              height: 32px;
              a {
                color: #fff;
              }
            }
          }
          .mediawww {
            position: absolute;
            bottom: 60px;
            background: #454f66;
            right: 0;
            width: 1090px;
            padding: 10px;
            z-index: 999;
            .countryplace {
              position: absolute;
              width: 308px;
              height: 15px;
              background: #454f66;
              bottom: -14px;
              right: 0;
            }
            .countryList {
              width: 24%;
              background: transparent;
              line-height: 32px;
              height: 32px;
              a {
                color: #fff;
              }
            }
          }
        }
      }
      .footidea {
        .footidea_t {
          padding: 20px 0;
          ul {
            li {
              border-right: 1px solid #646f7e;
              color: #646f7e;
              padding: 0 20px;
              font-size: 14px;
            }
          }
        }
        .footidea_c {
          margin-bottom: 10px;
          span {
            color: #646f7e;
            padding: 0 20px;
            font-size: 14px;
          }
        }
      }
    }
  }
}
</style>
